<!--
To change this template, choose Tools | Templates
and open the template in the editor.
-->
<!DOCTYPE html>
<html>
    <head>
        <link href="css/style.css" rel="stylesheet" type="text/css"/> 
        <script type="text/javascript" src="js/jquery.lib.js"></script>
        <script type="text/javascript" src="js/script.js"></script>
        <title>Home feed DJ page</title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">        
    </head>

    <body>
        <div id="pop-up"></div>
        <div id="mainpage">
            <div id="header">
                <div id="headerItem">
                    <a href=""><div id="logo"></div></a>
                    <div id="login">
                        <div id="notLogin">
                            <a onclick="login();">Sign in</a> |
                            <a>Sign up</a> |
                            <a>Artis sign in</a>
                        </div>
                        <div id="logged">
                            <div id="avatar"></div>
                            <a id="username" style="margin-left: 10px">hung.nguyen</a> |
                            <a onclick="logout();">Logout</a>
                        </div>
                    </div>
                </div>
            </div><!-- header -->
            <div id="content">
                <div id="leftDiv">
                    <div class="topads"></div>
                    <div class="yourads">
                    </div>
                    <div class="toplist">
                        <div class="title-line">
                            <span>Global chart</span>
                        </div>
                        <div class="listObject">
                            <a class="green-color">Top 40</a>
                            <a>Electro</a>
                            <a>Progressive</a>
                        </div>
                        <div class="listSong">
                            <ul>
                                <a><li>
                                        <div class="songNumber">01</div>
                                        <div class="song">
                                            <div class="songName">Nonstop - Việt Mix Cũng Phải Lên – Tuyển Tập Track Căng Nhất ...Dj kòy Sóc Sơn</div>
                                            DJ NIMBIA
                                        </div>
                                    </li></a>
                                <a><li>
                                        <div class="songNumber">02</div>
                                        <div class="song">
                                            <div class="songName">Nonstop - Việt Mix Cũng Phải Lên – Tuyển Tập Track Căng Nhất ...Dj kòy Sóc Sơn</div>
                                            DJ NIMBIA
                                        </div>
                                    </li></a>
                                <a><li>
                                        <div class="songNumber">03</div>
                                        <div class="song">
                                            <div class="songName">Nonstop - Việt Mix Cũng Phải Lên – Tuyển Tập Track Căng Nhất ...Dj kòy Sóc Sơn</div>
                                            DJ NIMBIA
                                        </div>
                                    </li></a>
                                <a><li>
                                        <div class="songNumber">04</div>
                                        <div class="song">
                                            <div class="songName">Nonstop - Việt Mix Cũng Phải Lên – Tuyển Tập Track Căng Nhất ...Dj kòy Sóc Sơn</div>
                                            DJ NIMBIA
                                        </div>
                                    </li></a>
                                <a><li>
                                        <div class="songNumber">05</div>
                                        <div class="song">
                                            <div class="songName">Nonstop - Việt Mix Cũng Phải Lên – Tuyển Tập Track Căng Nhất ...Dj kòy Sóc Sơn</div>
                                            DJ NIMBIA
                                        </div>
                                    </li></a>
                                <a><li>
                                        <div class="songNumber">06</div>
                                        <div class="song">
                                            <div class="songName">Nonstop - Việt Mix Cũng Phải Lên – Tuyển Tập Track Căng Nhất ...Dj kòy Sóc Sơn</div>
                                            DJ NIMBIA
                                        </div>
                                    </li></a>
                                <a><li>
                                        <div class="songNumber">07</div>
                                        <div class="song">
                                            <div class="songName">Nonstop - Việt Mix Cũng Phải Lên – Tuyển Tập Track Căng Nhất ...Dj kòy Sóc Sơn</div>
                                            DJ NIMBIA
                                        </div>
                                    </li></a>
                                <a><li>
                                        <div class="songNumber">08</div>
                                        <div class="song">
                                            <div class="songName">Nonstop - Việt Mix Cũng Phải Lên – Tuyển Tập Track Căng Nhất ...Dj kòy Sóc Sơn</div>
                                            DJ NIMBIA
                                        </div>
                                    </li></a>
                                <a><li>
                                        <div class="songNumber">09</div>
                                        <div class="song">
                                            <div class="songName">Nonstop - Việt Mix Cũng Phải Lên – Tuyển Tập Track Căng Nhất ...Dj kòy Sóc Sơn</div>
                                            DJ NIMBIA
                                        </div>
                                    </li></a>
                                <a><li>
                                        <div class="songNumber">10</div>
                                        <div class="song">
                                            <div class="songName">Nonstop - Việt Mix Cũng Phải Lên – Tuyển Tập Track Căng Nhất ...Dj kòy Sóc Sơn</div>
                                            DJ NIMBIA
                                        </div>
                                    </li></a>
                            </ul>
                        </div>
                    </div><!-- topList-->
                    <div class="yourads">
                    </div>
                    <img src="image/background/left-background.png"/>
                </div><!--left Div-->
                <div id="centerDiv">
                    <div id="slogan">
                        <div id="dot">
                            <div class="dot" id="dot1"></div>
                            <div class="dot" id="dot2"></div>
                            <div class="dot" id="dot3"></div>
                        </div>
                    </div><!-- slogan -->
                    <div class="bannerAds">
                        <div id="ads-title"><b>DJ RADIO</b> APPLICATION READY ON</div>
                        <a href=""><div class="appstore"></div></a>
                        <a href=""><div class="googleplay"></div></a>
                    </div><!-- banner-->
                    <div class="home-feed-djpage">
                        <div style="margin-bottom: 15px">
                            <a>HOME</a> / <a>ALL DJ VIETNAM</a> / <a class="green-color">FEED</a>
                        </div>
                        <div class="profile">
                            <div class="info">
                                <div class="profilePicture">
                                    <div class="profileBackground"></div>
                                    <img src="image/image/event1.jpg">
                                    <div class="mask-img"></div>
                                    <div class="edit-pf-pic"><a href="">Edit profile</a></div>
                                </div>
                                <div class="tag">
                                    <div class="tagItem focus">Feed</div>
                                    <div class="tagItem">Profe</div>
                                    <div class="tagItem">Music</div>
                                    <div class="tagItem">Youtube</div>
                                    <div class="tagItem">Events</div>
                                    <div class="tagItem">Contact</div>
                                </div>
                            </div><!-- info-->
                            <div class="mainInfo">
                                <span class="singerName">NIMBIA</span>
                                <div class="following followed" >FOLLOWING</div>
                                <div class="numbers">
                                    <span id="followNumber">57,968,006 <br/><small>FOLLOW</small></span>
                                    <span id="listenerNumber">2,044,101 <br/><small>LISTENERS</small></span>
                                    <span id="genre" style="margin:0">GENRE: <small>HOUSE, ELECTRO HOUSE</small></span>
                                </div>
                                <div class="post">
                                    <div class="profilePicture">
                                        <div class="profileBackground"></div>
                                        <img src="image/image/event1.jpg">
                                    </div>
                                    <div class="new-post">
                                        <h3 class="green-color">NIMBIA</h3>
                                        <div class="post-type">
                                            <span class="post-status green-color">Status</span>
                                            <span class="post-photo">Photo</span>
                                            <span class="post-music">Music</span>
                                            <span class="post-video">Youtube</span>
                                            <span class="post-event">Events</span>
                                        </div>                                        
                                        <div class="status-box">
                                            <div class="small-icon"></div>
                                            <textarea placeholder="What is in your mind?"></textarea>
                                        </div>
                                        <div class="photo-box">
                                            <div class="small-icon"></div>
                                            <div class="up-photo clearfix">
                                                <h5>What is in your mind?</h5>
                                                <div class="up-photo-btn">UPLOAD YOUR PHOTO</div>
                                                <div class="up-album-btn">CREATE PHOTO ALBUM</div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="post">
                                    <div class="profilePicture">
                                        <div class="profileBackground"></div>
                                        <img src="image/image/avatar4.png">
                                    </div>
                                    <div class="detail">
                                        <div>
                                            <p><span class="singerName green-color">NIMBIA</span> added a new photo</p>
                                            <p>Memorial Day Weekend is the perfect kicker into summer and cities all around the world deliver some of the most memorable events of the year. No matter what corner of the States you're in, there's bound to be a worthy event near you. If you slacked on planning and are scrambling to find where to go this upcoming weekend, you've come to the right place!</p>
                                        </div>
                                        <img src="image/image/event1.jpg"/>
                                        <div class="link2Facebook">
                                            <div class="link">
                                                <a href="">Like</a><a href="">Comment</a><a href="">Share</a>4 week ago<a style="margin-left: 40px" href="">Delete</a>
                                            </div>
                                            <div class="input">
                                                <h4><a href=""><img src="image/icon/traitim.png"/>3 people</a> like this</h4>
                                                <img src="image/icon/smallavatar.png">
                                                <input type="text">
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div> <!--profile-->
                    </div><!-- DJ profile-->
                    <div class="bannerAds">
                        <div id="ads-title"><b>DJ RADIO</b> APPLICATION READY ON</div>
                        <a href=""><div class="appstore"></div></a>
                        <a href=""><div class="googleplay"></div></a>
                    </div><!-- banner-->
                </div><!--center Div-->
                <div id="rightDiv">
                    <div class="topads"></div>
                    <div class="toplist">
                        <div class="title-line">
                            <span>TOP TEN</span>
                        </div>
                        <div class="listObject">
                            <a href="" class="green-color">Day</a>
                            <a href="">Week</a>
                            <a href="">Month</a>
                        </div>
                        <div class="listSong">
                            <ul>
                                <a><li>
                                        <div class="songNumber">01</div>
                                        <div class="song">
                                            <div class="songName">Nonstop - Việt Mix Cũng Phải Lên – Tuyển Tập Track Căng Nhất ...Dj kòy Sóc Sơn</div>
                                            DJ NIMBIA
                                        </div>
                                    </li></a>
                                <a><li>
                                        <div class="songNumber">02</div>
                                        <div class="song">
                                            <div class="songName">Nonstop - Việt Mix Cũng Phải Lên – Tuyển Tập Track Căng Nhất ...Dj kòy Sóc Sơn</div>
                                            DJ NIMBIA
                                        </div>
                                    </li></a>
                                <a><li>
                                        <div class="songNumber">03</div>
                                        <div class="song">
                                            <div class="songName">Nonstop - Việt Mix Cũng Phải Lên – Tuyển Tập Track Căng Nhất ...Dj kòy Sóc Sơn</div>
                                            DJ NIMBIA
                                        </div>
                                    </li></a>
                                <a><li>
                                        <div class="songNumber">04</div>
                                        <div class="song">
                                            <div class="songName">Nonstop - Việt Mix Cũng Phải Lên – Tuyển Tập Track Căng Nhất ...Dj kòy Sóc Sơn</div>
                                            DJ NIMBIA
                                        </div>
                                    </li></a>
                                <a><li>
                                        <div class="songNumber">05</div>
                                        <div class="song">
                                            <div class="songName">Nonstop - Việt Mix Cũng Phải Lên – Tuyển Tập Track Căng Nhất ...Dj kòy Sóc Sơn</div>
                                            DJ NIMBIA
                                        </div>
                                    </li></a>
                                <a><li>
                                        <div class="songNumber">06</div>
                                        <div class="song">
                                            <div class="songName">Nonstop - Việt Mix Cũng Phải Lên – Tuyển Tập Track Căng Nhất ...Dj kòy Sóc Sơn</div>
                                            DJ NIMBIA
                                        </div>
                                    </li></a>
                                <a><li>
                                        <div class="songNumber">07</div>
                                        <div class="song">
                                            <div class="songName">Nonstop - Việt Mix Cũng Phải Lên – Tuyển Tập Track Căng Nhất ...Dj kòy Sóc Sơn</div>
                                            DJ NIMBIA
                                        </div>
                                    </li></a>
                                <a><li>
                                        <div class="songNumber">08</div>
                                        <div class="song">
                                            <div class="songName">Nonstop - Việt Mix Cũng Phải Lên – Tuyển Tập Track Căng Nhất ...Dj kòy Sóc Sơn</div>
                                            DJ NIMBIA
                                        </div>
                                    </li></a>
                                <a><li>
                                        <div class="songNumber">09</div>
                                        <div class="song">
                                            <div class="songName">Nonstop - Việt Mix Cũng Phải Lên – Tuyển Tập Track Căng Nhất ...Dj kòy Sóc Sơn</div>
                                            DJ NIMBIA
                                        </div>
                                    </li></a>
                                <a><li>
                                        <div class="songNumber">10</div>
                                        <div class="song">
                                            <div class="songName">Nonstop - Việt Mix Cũng Phải Lên – Tuyển Tập Track Căng Nhất ...Dj kòy Sóc Sơn</div>
                                            DJ NIMBIA
                                        </div>
                                    </li></a>
                            </ul>
                        </div>
                    </div>
                    <div class="yourads">
                    </div>
                    <div class="yourads">
                    </div>
                    <img src="image/background/right-background.png"/>
                </div><!--right Div-->
            </div><!-- content -->
            <div id="footer">
                <div id="footerItem">
                    <a href=""><img id="radioIcon" src="image/image/radio.png"/></a>
                    <a class="green-color" style="float:left">Contact us</a>
                    <span>&#169; 2013 Dj Radio App. All Rights Reserved</span>
                    <a id="facebookLink" href="#">Follow us
                        <img src="image/icon/faceIcon.png">
                    </a>
                </div>
            </div><!--footer-->
        </div>
        <div class="up-music">
            <img class="close" src="image/icon/close.png" />
            <h1>Upload your music</h1>
            <div class="row clearfix">
                <p>Status</p>
                <input type="text" placeholder="What is in your mind?"/>
            </div>
            <div class="row clearfix">
                <p>Title music</p>
                <input type="text"/>
            </div>                  
            <div class="row clearfix">
                <p>Song type</p>
                <div class="selectbox">
                    <div class="request">Please choose your song type
                        <div class="drop"></div>
                    </div>
                    <div class="option">Mix</div>
                    <div class="option">Chart</div>
                </div><!--choose song type-->                                  
            </div>
            <div class="row clearfix">
                <p>Genre</p>
                <div class="genre">
                    <ul >
                        <li>
                            <div class="checkbox"></div>
                            <span>VN House</span>

                        </li>
                        <li>
                            <div class="checkbox"></div>
                            <span>Dubstep</span>
                        </li>
                        <li style="width:70px">
                            <div class="checkbox"></div>
                            <span>Chill</span>
                        </li>
                        <li>
                            <div class="checkbox"></div>
                            <span>House</span>
                        </li>
                        <li>
                            <div class="checkbox"></div>
                            <span>Hiphop, RnB</span>
                        </li>
                        <li style="width:70px">
                            <div class="checkbox"></div>
                            <span>Trap</span>
                        </li>
                        <li>
                            <div class="checkbox"></div>
                            <span>Trance</span>
                        </li>
                        <li>
                            <div class="checkbox"></div>
                            <span>Electro</span>
                        </li>
                        <li style="width:70px">
                            <div class="checkbox"></div>
                            <span>Other</span>
                        </li>
                    </ul>
                </div><!--Genre-->
            </div>
            <div class="row clearfix">
                <p>Lyric or track list</p>
                <textarea></textarea>
            </div>
            <div class="row clearfix">
                <p>Upload cover</p>
                <div class="Upload">
                    <div class="button clearfix">
                        <div>Select file</div>
                    </div>
                    <div class="progress">
                        <div class="fileInfo">
                            <div class="filename">London Brigde...(1321kb)</div>
                            <div class="percent">100%</div>
                        </div>
                        <div class="meter"></div>
                    </div>
                    <div class="uploadfile"></div>                                    
                </div><!--avatar-->
            </div> 
            <div class="row clearfix">
                <p>Upload song quality</p>
                <div class="Upload">
                    <div class="button clearfix">
                        <div>Select file</div>
                    </div>
                    <div class="progress">
                        <div class="fileInfo">
                            <div class="filename">London Brigde...(1321kb)</div>
                            <div class="percent">100%</div>
                        </div>
                        <div class="meter"></div>
                    </div>                                  
                </div><!--avatar-->
            </div>
            <div class="submit-btn">
                <div class="button"><div>Submit Form</div></div>
                <div class="button"><div>Clear Form</div></div>
            </div>                                                                                                
        </div><!--Up-music page-->
        <div class="up-youtube">
            <img class="close" src="image/icon/close.png" />
            <h1>Add link youtube</h1>
            <div class="row clearfix">
                <p>Status</p>
                <input type="text" placeholder="What is in your mind?"/>
            </div>
            <div class="row clearfix">
                <p>Title music</p>                
                <input type="text"/>
                <div class="button clearfix" style="float: left;margin-left: 15px">
                    <div>Get cover</div>
                </div>
            </div>                  
            <div class="row clearfix">
                <p>Lyric or track list</p>
                <textarea></textarea>
            </div>
            <div class="row clearfix">
                <p>Upload cover</p>
                <div class="Upload">
                    <div class="button clearfix">
                        <div>Select file</div>
                    </div>
                    <div class="progress">
                        <div class="fileInfo">
                            <div class="filename">London Brigde...(1321kb)</div>
                            <div class="percent">100%</div>
                        </div>
                        <div class="meter"></div>
                    </div>
                    <div class="uploadfile"></div>                                    
                </div><!--avatar-->
            </div>
            <div class="submit-btn">
                <div class="button clearfix"><div>Submit Form</div></div>
                <div class="button clearfix"><div>Clear Form</div></div>
            </div>                                                                                                
        </div><!--Up youtube video page-->
        <div class="up-event">
            <img class="close" src="image/icon/close.png" />
            <h1>Add your event</h1>
            <div class="row clearfix">
                <p>Status</p>
                <input type="text" placeholder="What is in your mind?"/>
            </div>
            <div class="row clearfix">
                <p>Title event</p>
                <input type="text"/>
                <div class="button clearfix" style="float: left;margin-left: 15px">
                    <div>Open time</div>
                </div>
            </div>                  
            <div class="row clearfix">
                <p>Intro</p>
                <textarea></textarea>
            </div>
            <div class="row clearfix">
                <p>Upload poster</p>
                <div class="Upload">
                    <div class="button clearfix">
                        <div>Select file</div>
                    </div>
                    <div class="progress">
                        <div class="fileInfo">
                            <div class="filename">London Brigde...(1321kb)</div>
                            <div class="percent">100%</div>
                        </div>
                        <div class="meter"></div>
                    </div>
                    <div class="uploadfile"></div>                                    
                </div><!--avatar-->
            </div>
            <div class="submit-btn">
                <div class="button clearfix"><div>Post</div></div>
                <div class="button clearfix"><div>Clear Form</div></div>
            </div>                                                                                                
        </div><!--Add event page-->
        <div id="loginPage">
            <div id="loginDiv">
                <p>LOG IN</p>
                EMAIL<br/>
                <input type="text" id="txbusername"/><br/>
                PASSWORD<br/>
                <input type="password" id="password"/><br/>
                <a>FORGOT PASSWORD</a><br/>
                <input type="button" id="btnSignin" value="Sign in"/><br/>
                <div id="linkIcon">
                    <div style="margin-top: 5px">LOGIN WITH</div>
                    <div class="icon face"></div>
                    <div class="icon google"></div>
                    <div class="icon yahoo"></div>
                </div>
            </div>
            <div id="registerDIv">
                <img class="close" src="image/icon/close.png" />
                <div id="inputInfo">
                    <p>REGISTER</p>
                    NAME<br/>
                    <input type="text"/><br/>
                    PASSWORD<br/>
                    <input type="password"/><br/>
                    RETYPE PASSWORD<br/>
                    <input type="password"/><br/>
                    EMAIL<br/>
                    <input type="email"/><br/>
                    TYPE THE CHARACTERS<br/>
                    <div id="confirmkey">
                        <div id="keypicture"></div>
                        <div id="refresh"></div>
                        <input type="text"/>
                    </div>
                    <input type="button" id="btnSignup" value="Sign up"/><br/>
                </div>
            </div>
        </div><!-- Login page -->
    </body>
</html>
